<template>
    <div class="common siteMange">
        <innerCommon :location="location">
            <template slot="left">
                <span>专家列表</span>
                <a-select v-if="type==0" @change="statusChange" :allowClear="true" placeholder="审核状态" style='width:250px;margin-right:10px'>
                    <a-select-option 
                        :value="item.value" 
                        v-for="(item,index) in statusList" 
                        :key="index">
                        {{item.name}}
                    </a-select-option>
                </a-select>
                <a-input-search class="inputStyle" placeholder="请输入姓名"  v-model="searchValue" enter-button @search="onSearch" />
            </template>
            <div slot="table">
                <topList
                    :topList="topList"
                    :currentItem="type"
                    @changeTop="changeTop"
                ></topList>
                <a-table 
                    size="middle"
                    :columns="columns" 
                    :data-source="list" 
                    :pagination="pagination"
                    :rowKey="record=>record.id"
                    @change="changePage"
                    :locale="{'emptyText': '暂无数据'}"
                    bordered>
                    <div slot="status" slot-scope="index,record"> 
                        <span v-if="record.status==0" style="color:orange">未审核</span>
                        <span v-else-if="record.status==1" style="color:green">已通过</span>
                        <span v-else style="color:red">未通过</span>
                    </div>
                    <div slot="action" slot-scope="index,record" class="tableAction" v-if="type==0">
                        <span @click="todetail(record)">查看详情</span>
                        <span v-if="record.status!=1" @click="isPass(1,record.id)">通过</span>
                        <span v-if="record.status!=2" @click="isPass(2,record.id)">不通过</span>
                        <confirmBox
                            v-if="record.status==0"
                            @handleOk="deleteExpert(record.id)"
                            :typeName="'删除'"
                            :noticeInfo="record.realname"
                            :noticeType="'专家'"
                        ></confirmBox>
                    </div>
                    <div slot="action" slot-scope="index,record" class="tableAction" v-else>
                        <span @click="todetail(record)">查看详情</span>
                        <span @click="cancelQuail(record)">{{record.qualified?'取消资格':"恢复资格"}}</span>
                    </div>
                </a-table>
            </div>
        </innerCommon>
        <detailModal
            :detailBox="detailBox"
            :dataList="dataList"
            @cancel="detailBox=false"
        >
            <span slot="content">{{ispassed==1?'是':'否'}}</span>
        </detailModal>
    </div>
</template>
<script>
import innerCommon from "@/components/common/innerCommon"
import detailModal from "@/components/common/detailModal"
import topList from "@/components/common/topList"
import confirmBox from "@/components/common/confirmBox"
import {
    getExpertListApi,
    getTrainerListApi,
    updateExpertStatusApi,
    deleteExpertApi,
    changeQualifyApi
} from "@/request/api"
const columns=[
    {
        title: '序号',
        dataIndex: 'index',
        width:70
    },{
        title: '姓名',
        dataIndex: 'realname',
    },{
        title: '性别',
        dataIndex: 'gender',
    },{
        title: '账号',
        dataIndex: 'account',
    },{
        title: '身份证号',
        dataIndex: 'idCardNum',
    },{
        title: '手机号',
        dataIndex: 'telephone',
    },{
        title: '所在单位',
        dataIndex: 'instituteName',
    },{
        title: '联系地址',
        dataIndex: 'address',
    },{
        title: '审核人',
        dataIndex: 'publisher',
    },{
        title: '申请时间',
        dataIndex: 'createTime',
    },{
        title: '审核状态',
        scopedSlots: { customRender: 'status' },
    },{
        title: '操作',
        scopedSlots: { customRender: 'action' },
    }
]
export default {
    name:"viewSign",
    components:{innerCommon,topList,confirmBox,detailModal},
    watch:{
        searchValue:function(val){
            this.searchValue=val.trim()
        }
    },
    created(){
        this.searchInfo.examId=this.$route.query.examId
        this.location=[
            {name:'1+X管理',path:''},{name:'站点管理',path:'/siteManage'}
        ]
        this.init()
    },
    data(){
        return{
            type:0,
            columns,
            location:[],
            searchValue:'',
            topList:[
                {
                    name:"专家",
                    id:0
                },{
                    name:'考核师',
                    id:1
                },{
                    name:'培训师',
                    id:2
                },{
                    name:'考务人员',
                    id:3
                }
            ],
            list:[],
            pagination:{total:0,pageSize:10,current:1},
            searchInfo:{
                page:1,
                pageSize:10,
                keyword:'',
                status:'',
            },
            trainerInfo:{
                page:1,
                pageSize:10,
                keyword:'',
                type:'',
            },
            statusList:[
                {'name':'未审核','value':0},
                {'name':'已通过','value':1},
                {'name':'已拒绝','value':2},
            ],
            detailBox:false,
            dataList:[],
            ispassed:''
        }
    },
    methods:{
        init(){
            if(this.type==0){
                this.getToken(getExpertListApi,this.searchInfo,res=>{
                    this.list=res.data.rows.map((item,index)=>({
                        ...item.user,
                        ...item,
                        index:(this.searchInfo.page-1)*10+index+1
                    }))
                    this.pagination.total=res.data.count
                })
            }else{
                this.getToken(getTrainerListApi,this.trainerInfo,res=>{
                    this.list=res.data.rows.map((item,index)=>({
                        ...item,
                        ...item.owner,
                        index:(this.trainerInfo.page-1)*10+index+1
                    }))
                    this.pagination.total=res.data.count
                })
            }
        },
        onSearch(data){
            if(this.type==0){
                this.searchInfo.keyword=data
                this.pagination.current=1
                this.searchInfo.page=1
            }else{
                this.trainerInfo.keyword=data
                this.pagination.current=1
                this.trainerInfo.page=1
            }
            this.init()
        },
        changeTop(data){
            if(data==0){
                this.searchInfo.status=''
                this.searchInfo.page=1
                this.pagination.current=1
                this.type=data
                this.columns[8]={
                    title: '审核人',
                    dataIndex: 'publisher',
                }
                this.columns[9]={
                    title: '申请时间',
                    dataIndex: 'createTime',
                }
                this.columns[10]={
                    title: '审核状态',
                    scopedSlots: { customRender: 'status' },
                }
                this.columns[11]={
                    title: '操作',
                    scopedSlots: { customRender: 'action' },
                }
            }else{
                this.trainerInfo.page=1
                this.pagination.current=1
                this.type=data
                this.trainerInfo.type=data
                this.columns[8]={
                    title: '加入时间',
                    dataIndex: 'createTime',
                }
                this.columns[9]={
                    title: '操作',
                    scopedSlots: { customRender: 'action' },
                }
                this.columns.length=10
            }
            this.init()
        },
        changePage(data){
            if(this.type==0){
                this.searchInfo.page=data.current
                this.pagination.current=data.current
                this.init()
            }else{
                this.trainerInfo.page=data.current
                this.pagination.current=data.current
                this.init()
            }
            
        },
        // 删除
        deleteExpert(id){
            this.getToken(deleteExpertApi,{'applyId':id},res=>{
                this.$message.success(res.message)
                this.init()
            })
        },
        isPass(type,id){
            this.getToken(updateExpertStatusApi,{'applyId':id,'status':type},data=>{
                this.$message.success(data.message)
                this.init()
            })
        },
        statusChange(data){
            this.searchInfo.status=data
            this.init()
        },
        todetail(data){
            if(this.type==0){
                this.$router.push({path:"/expertDetail",query:{id:data.id}})
            }else{
                this.detailBox=true
                this.ispassed=data.passed
                this.dataList=[
                    {'name':'姓名','info':data.realname},
                    {'name':'性别','info':data.gender},
                    {'name':'账号','info':data.account},
                    {'name':'身份证号','info':data.idCardNum},
                    {'name':'手机号','info':data.telephone},
                    {'name':'所属单位','info':data.instituteName},
                    {'name':'联系地址','info':data.address},
                    {'name':'培训活动','info':data.onePlusXTraining.title},
                    {'name':'培训成绩','info':data.theoryScore},
                    {'name':'是否合格','scopedSlots':{"customRender":'content'}},
                ]
            }
        },
        // 取消恢复资格
        cancelQuail(data){
            this.$confirm({
                title: '确认'+(data.qualified?'取消“':'恢复“')+data.realname+'”资格吗?',
                cancelText:"取消",
                okText:'确定',
                onOk:()=>{
                    this.getToken(changeQualifyApi,{'type':this.type,'userId':data.id,'status':data.qualified?2:1},res=>{
                        this.$message.success(res.message)
                        this.init()
                    })
                },
                onCancel() {
                },
            });
        }
    }
}
</script>
<style lang="stylus">
.siteMange{
    .innerCommon{
        .content{
            margin-top:77px;
            position:relative;
        }
    }
    .tableWrapUl{
        position:absolute;
        top:-60px;
        left:0;
    }
}
</style>